import { Pie } from "@ant-design/plots";

const ExamChart = ({
  excellentCount,
  excellentRate = 0,
  failCount,
  failRate = 0,
  goodCount,
  goodRate = 0,
  passCount,
  passRate = 0,
}: any) => {
  const data = [
    { type: "优秀", value: excellentCount, rate: excellentRate * 100 },
    { type: "良好", value: goodCount, rate: goodRate * 100 },
    { type: "及格", value: passCount, rate: passRate * 100 },
    { type: "不及格", value: failCount, rate: failRate * 100 }, // 处理 failRate 可能为 undefined 的情况
  ].filter((item) => item.value > 0); // 过滤掉人数为0的项
  const config = {
    data,
    angleField: "value",
    colorField: "type",
    radius: 0.8,
    label: {
      text: (d) => `${d.type}\n人数：${d.value}\n 比例：${d.rate}%`,
      position: "spider",
    },
    legend: {
      color: {
        title: false,
        position: "right",
        rowPadding: 5,
      },
    },
    tooltip: {
      title: "type",
      items: [
        { field: "rate", name: "比例", valueFormatter: (rate) => `${rate}%` },
        { field: "value", name: "人数" },
      ],
    },
  };

  // @ts-ignore
  return <Pie {...config} />;
};

export default ExamChart;
